App Clipsに関してApp Store Connectから設定できることを把握できる「What’s new in App Store Connect」セッションメモ #WWDC20
はじめに
beta版の環境を手元に落としてApp Clipsを体験してみましたが、実際のリリースの時にApp Store Connectを無視することはできません。WWDCのセッションにApp Store Connectに関するものがあったので気になって観てみた所、App Clips利用の際の設定方法やカスタマイズできる所、フローがざっと把握できる内容だったので記事にしようと思いました。
セッションの内容は以下のリンクから確認できます。
beta版なので実装や実際の画面を載せることはできないので、セッションのスクリーンショットを元にしています。
本記事は Apple からベータ版として公開されているドキュメントやセッションを情報源としています。 そのため、正式版と異なる情報になる可能性があります。ご留意の上、お読みください。
App Clips
App Clipsとは何なのかについては以下の記事で触れられています。
App Clip体験を提供するために以下のことを行うよう強調されていました。
- 確かなユーザー体験を提供できていることを確認するためのbeta testを行う
- App Clipsをリリースする準備をする時に、App Clip Metadata をセットアップする
- ユーザーがApp Clipsで何ができるのか理解できる情報を提供するために使用する
- App Clipsを立ち上げるために必要なAssociated Domainsを定義する
- App Clip Invocationの設定
Domain Associations
Invocation URLは全てdomainをURLに含みます。App Clipsを呼び出すためにdomainを使用することを承認されていることを確認する必要があるとセッションでは述べられています。 方法は以下です。
- Associated Domains EntitlementにどのドメインをApp Clipsに関連付けるか定義する
- そのドメインに提供するためのApple App Site Association filesのセットアップ
ドメインURLのステータスはApp Store Connectで確認できます。
Associated DomainについてはWWDC2019で解説されています。
-
What's New in Universal Links - WWDC 2019 - Videos - Apple Developer
App Clipの設定
セッションではApp Clipsへの動線としてバナーを設置したページを元に解説が進められていました。
バナーをタップすると以下のようにユーザーがデバイス上で起動する前に詳細な情報を提示しています。
OpenをタップするとApp Clipsが起動しコンテンツが表示されます。
App ClipsをOpenした後は機能のフルバージョンを体験したい場合はApp Storeでダウンロードできるようにリンクが表示されています。
App Clipsへの導線はSafariの他に、
- Messages
- Maps
- NFC TAG
- QR COde
などがあります。導線で重要なのはInvocation URLです。
Invocation URLはApp Clipsが表示された時にmetadataから何をApp Clip Cardに表示するかを決定することに使用されます。そしてApp Clipがユーザーのデバイスによって起動された時にApp Clipsにdeep link経由で渡されてApp Clipの任意の機能が提供されます。deep linkでアプリ内の特定の画面を表示することはよくありますが、App Clipでは機能の選択に利用されているとのことでした。
提供とβテストの方法
AppとApp Clipの開発後、併せてビルドを行います。別々にビルドすることはできません。ビルドしてApp store connectにアップロードを済ませるとしばらくたったら反映されます。
セッションでは、Test Flightで配信を行うときの画面を元に手順の紹介が続けられました。
画像の赤枠を見るとビルドにApp Clipが含まれていることが確認できます。
App Clipを含むバージョンの詳細を確認するとApp Clip Invocationsというセクションが新設されています。
Add App Clip InvocationでApp Clip Invocationが追加できます。タイトルとURLを入力する必要があります。
設定後TestFlightでは設定したそれぞれのURLとタイトルに対応したApp Clipがテストできます。
TESTをクリックするとApp Clipに設定されたInvocation URLが渡されて任意の機能がテストできます。
App Clip Card
App Clip Cardはヘッダー画像、App clipのタイトルとサブタイトル、Actionの文言を設定できます。また、App Clip Cardが表示される導線はSafari経由とMessagesアプリ経由のみです。
App Store Connectヘッダーや文言などはApp Store Connectで設定します。
App ClipをSafari上で表示させるにはmetadataをウェブページに埋め込みます。
例
<meta name="apple-itunes-app" content="app-id=9148719741974, app-cip-bundle-id=org.app_name.clip">
Advanced Usage
App Store Connectで行える基本的な設定やApp Clip Cardの使い方はここまでですが、込み入ったユースケース用に特定のInvocation URLに対してmetadataがカスタマイズできるようになっています。
App Store ConnectのApp Clipの設定ページにAdvanced App Clip Experienceというセクションがあり、Get Startedというボタンが設置されています。ここからmetadataのカスタマイズが行なえます。セッションではマップアプリ上にカスタマイズされたApp Clip Cardを表示する手順が説明されていました。
ここではまずカスタマイズされたApp Clipの体験を提供するURLを指定します。App Clip Experience URLと呼称されています。
すると先程より詳細にカスタマイズできるApp Clip Cardが設定できる画面に遷移します。
また、このように定義したApp Clip Experiencesは一覧で管理できるページが提供されています。
さいごに
What's new in App Store ConnectのようなApp Store Connectに関するセッションはWWDCの度に行われていて、知らないといざという時に1から調べ直すことになります。まだベータ版の機能に関する設定項目ですが概要を把握できてApp Clipsを実務で使いたい気持ちが高まりました。字幕付きではありますが英語のセッションのレポートなので誤りがあるかも知れません。なにかお気づきの際はお知らせください。
最後まで読んでいただきありがとうございました。
![[小ネタ] ラスベガスに到着してからiPhoneのカメラのシャッター音が消えた件 #AWSreInvent](https://devio2023-media.developers.io/wp-content/uploads/2023/11/eyecatch_reinvent-2023-from-lasvegas-dayori.png)
